import { Modal, Form, Button, Input } from 'antd';
import React from 'react';
import List from "./List";

const FormItem = Form.Item;

const DoAddUser = ({
  doAddUser,
  doShowAdd,
  form: {
    getFieldDecorator,
    validateFieldsAndScroll,
    getFieldValue,
    setFieldsValue
  },
  ...addProps,
}) => {

  const handleCancel = () => {
    doShowAdd(false)
  };

  const handleOk = (e) => {
    e.preventDefault();
    validateFieldsAndScroll((err, values) => {
      if (!err) {
        console.info(values)
        doAddUser(values)
      }
    });
  };


  return (
    <Form >
      <Modal
        visible={addProps.visible}
        title="请添加用户"
        onOk={handleOk}
        onCancel={handleCancel}
        width={300}
        destroyOnClose={true}
        footer={[
          <Button key="back" onClick={handleCancel}>取消</Button>,
          <Button key="submit" type="primary" htmlType="submit" onClick={handleOk} >
            确认
            </Button>,
        ]}>
        <FormItem
          label="手机"
          labelCol={{ span: 5 }}
          wrapperCol={{ span: 18 }}
        >
          {getFieldDecorator('phone', {
            rules: [
              { required: true, message: '请输入正确的手机格式' },

            ],
            initialValue:"",
            validateTrigger: "onSubmit"
          })(
            <Input/>
          )}
        </FormItem>
      </Modal>
    </Form>
  );
};
export default Form.create()(DoAddUser);
